<template>
  <div class="jyhsj">
    <div class="space-around bdb pb20 pt20">
      <div class="flex align-center">
        <img
          class="image"
          :src="imgUrl + '/profile/personinfo/2023/9/22/企业专区_5fee9bb432634e8a96bd9ba34e5b606f.png'"
        />
        <div class="ml10 tac">
          <div class="fs18 bold">{{ parseFloat(dataInfo.corpNum).toFixed(0) || 0 }}</div>
          <div class="fs12 mt10">企业经营户(户)</div>
        </div>
      </div>
      <div class="flex align-center">
        <img
          class="image"
          :src="imgUrl + '/profile/personinfo/2023/9/22/个人商铺_314441cf6146403c8773ceb2d049a3bd.png'"
        />
        <div class="ml10 tac">
          <div class="fs18 bold">{{ parseFloat(dataInfo.personNum).toFixed(0) || 0 }}</div>
          <div class="fs12 mt10">个人经营户(户)</div>
        </div>
      </div>
    </div>
    <div class="space-between mt40">
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num1 || 0 }}</div>
        <div class="fs12">50亩以下(个))</div>
      </div>
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num2 || 0 }}</div>
        <div class="fs12">50~100亩(个))</div>
      </div>
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num3 || 0 }}</div>
        <div class="fs12">100~300亩(个)</div>
      </div>
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num4 || 0 }}</div>
        <div class="fs12">300~500亩(个)</div>
      </div>
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num5 || 0 }}</div>
        <div class="fs12">500~800亩(个)</div>
      </div>
      <div class="tac text-overflow">
        <div class="fs18 bold">{{ dataInfo.num6 || 0 }}</div>
        <div class="fs12">800亩以上(个)</div>
      </div>
    </div>
  </div>
</template>

<script>
import { manageData } from '@/api/index'

export default {
  name: 'Jyhsj',
  data() {
    return {
      imgUrl: process.env.VUE_APP_IMG_API,
      dataInfo: {}
    }
  },
  created() {
    this.getData()
  },
  methods: {
    getData() {
      manageData().then((res) => {
        this.dataInfo = res.data
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.jyhsj {
  height: 213px;
}
.image {
  height: 60px;
  width: 60px;
}
</style>
